/**
 * Created by user on 2018/10/31.
 */

function _Footer() {
    var self = this
    var $bd = $('body'), $win = $(window)
    self.btnTimer = null
    self.sl = {
        mask: '.new_footer_bar_mask',
        tab: '.new_footer_bar',
        btn: '.new_nav_btn',
        header: '.bookmarkMenu'
    }
    self.domStr = ''
    self.init = function () {
        if ($(self.sl.btn).length <= 0 || $(self.sl.mask).length <= 0) {
            return
        }
        $bd.find(self.sl.header).remove()
        $bd.find(self.sl.btn).show()
        self.bindEvent()
    }
    self.bindEvent = function () {
        $bd.on('click', self.sl.btn, function () {
            self.toggleNewFooterBar(true)
        })
        $bd.on('click', self.sl.mask, function () {
            self.toggleNewFooterBar(false)
        })
        $win.on('scroll', function () {
            self.handleScroll()
        })
    }
    self.handleScroll = function () {
        if (!window.isMiniprogram) return
        $(self.sl.btn).fadeOut()
        self.btnTimer && clearTimeout(self.btnTimer)
        self.btnTimer = setTimeout(function () {
            $(self.sl.btn).fadeIn()
        }, .5 * 1000)
    }
    self.toggleNewFooterBar = function (bool) {
        var $mask = $(self.sl.mask)
        if ($mask.length <= 0 && !self.domStr) return
        if (!self.domStr) {
            self.domStr = '<div class="new_footer_bar_mask">' + $mask[0].innerHTML + '</div>'
            $mask.remove()
        }
        if (bool) {
            $bd.append(self.domStr)
            $bd.find(self.sl.mask).addClass('weui-animate-fade-in')
            $bd.find(self.sl.tab).addClass('weui-animate-slide-up')
        } else {
            $bd.find(self.sl.mask).addClass('weui-animate-fade-out')
            $bd.find(self.sl.tab).addClass('weui-animate-slide-down')
                .on('animationend webkitAnimationEnd', function () {
                    $bd.find(self.sl.mask).remove()
                })
        }

    }
}

function _Audio(ele, parents) {
    var self = this
    self.ele = ele
    self.parents = parents
    self.durationTimer = null
    self.container = $(ele)
    self.audio = self.container.find('audio')[0]
    self.duration = 0
    self.paused = true
    self.handleAction = function () {
        if (self.paused) {
            for (var i in self.parents) {
                var custom = self.parents[i]
                if (self.ele != custom.ele && !custom.paused) {
                    custom.audio.pause()
                }
            }
        }
        self.paused && self.audio.play()
        !self.paused && self.audio.pause()
        self.paused = !self.paused
        self.updateIcon()
    }
    self.handleAudioEvent = function (type) {
        if (type == 'ended') {
            self.paused = true
            self.updateIcon()
        }
        if (type == 'timeupdate') {
            self.updateTime()
        }
        if (type == 'pause') {
            self.paused = true
            self.updateIcon()
        }
    }
    self.updateIcon = function () {
        var $icon = self.container.find('.action_icon')
        var $animate = self.container.find('.custom_animate_bars')
        var pauseSrc = $icon.attr('src').replace('play', 'pause')
        var playSrc = $icon.attr('src').replace('pause', 'play')
        self.paused && $icon.attr('src', playSrc) && $animate.hide()
        !self.paused && $icon.attr('src', pauseSrc) && $animate.show()
    }
    self.updateTime = function () {
        var time = self.audio.currentTime
        if (!self.duration) {
            return
        }
        var percent = parseInt(time * 100 / self.duration)
        percent = percent > 100 ? 100 : percent
        var $left = self.container.find('.b_side.left')
        var $bar = self.container.find('.pre_bar .active')
        $left.text(this.formatTime(time))
        $bar.css('width', percent + '%')
    }
    self.getDurationSuccess = function (d) {
        self.duration = d
        self.container.find('.b_side.right').text(this.formatTime(self.duration))
    }
    self.getAudioDuration = function () {
        self.audio.load()
        self.durationTimer = setInterval(function () {
            var duration = self.audio.duration
            if (duration > 0) {
                clearInterval(self.durationTimer)
                self.getDurationSuccess(duration)
            }
        }, 10)
    }
    self.bindEvent = function () {
        self.container.find('.action_icon').on('click', function () {
            self.handleAction()
        })
        self.audio.addEventListener('timeupdate', function () {
            self.handleAudioEvent('timeupdate')
            if (self.duration && self.audio.duration > 0) {
                self.getDurationSuccess(self.duration)
            }
        })
        self.audio.addEventListener('pause', function () {
            self.handleAudioEvent('pause')
        })
        self.audio.addEventListener('ended', function () {
            self.handleAudioEvent('ended')
        })
    }
    self.initBar = function () {
        var str = ''
        for (let i = 0; i < 200; i++) {
            const left = (i * 2) + 1;
            const anim = Math.floor(Math.random() * 75 + 400);
            const height = Math.floor(Math.random() * 55 + 3);
            str += '<div class="bar" style="left:' + left + 'px;animation-duration:' + anim + 'ms;height:' + height + 'px"></div>'
        }
        self.container.find('.custom_animate_bars').get(0).innerHTML = str
    }
    self.formatTime = function (s) {
        var sec = Math.ceil(s)
        var hh = parseInt(sec / 3600)
        var mm = (sec - hh * 3600) / 60
        mm = parseInt(mm)
        var ss = sec - hh * 3600 - mm * 60
        var prefix = ''
        hh > 0 && (prefix = (hh < 10 ? ('0' + hh) : (hh + '')) + ':')
        mm = mm < 10 ? ('0' + mm) : (mm + '')
        ss = ss < 10 ? ('0' + ss) : (ss + '')
        return prefix + mm + ':' + ss
    }
    self.init = function () {
        self.initBar()
        self.bindEvent()
        self.getAudioDuration()
    }
}
function _AudioManager() {
    var self = this
    self.sl = {
        item: '.custom_audio_component'
    }
    self.customList = []
    self.init = function () {
        $(self.sl.item).each(function (i, ele) {
            var custom = new _Audio(ele, self.customList)
            custom.init()
            self.customList.push(custom)
        })
    }
}

function _CTA() {
    var self = this
    self.FT = new _Footer()
    self.AM = new _AudioManager()
    self.initFT = function () {
        self.FT.init()
    }
    self.initAM = function () {
        self.AM.init()
    }
}
window.CTA = new _CTA()
CTA.initAM()
var storage = sessionStorage
var version = parseInt(storage.getItem('cta_browser_version'))
if (isNaN(version)) {
    wx.miniProgram.getEnv(function (res) {
        var version = res.miniprogram ? 1 : 0
        window.isMiniprogram = res.miniprogram
        storage.setItem('cta_browser_version', version)
        if (window.isMiniprogram) {
            CTA.initFT()
        } else {

        }
    })
}
if (version) {
    CTA.initFT()
}